<template>
  <div>
    <el-main>
      <el-table
        :data="tableData"
        border
        style="width: 100%"
        :row-class-name="tableRowClassName"
        :header-cell-style="{ background: '#58B7FF', color: '#ffffff' }"
      >
        <el-table-column fixed="left" prop="name" label="姓名" width="100">
        </el-table-column>
        <el-table-column prop="sex" label="性别" width="65">
          <template slot-scope="scope">
            <el-tag
              :type="scope.row.sex === '男' ? 'success' : 'danger'"
              disable-transitions
              >{{ scope.row.sex }}</el-tag
            >
          </template>
        </el-table-column>

        <el-table-column prop="department" label="应聘部门" width="150">
        </el-table-column>

        <el-table-column prop="post" label="应聘岗位" width="150">
        </el-table-column>

        <el-table-column prop="mobile" label="电话" width="120">
        </el-table-column>

        <el-table-column prop="email" label="邮箱"> </el-table-column>

        <el-table-column prop="userid" label="入职条件" width="150">
          <template slot-scope="{ row }">
            {{ row.userid == null ? "员工未补充信息" : "员工已补充信息" }}
          </template>
        </el-table-column>
        <el-table-column prop="employdate" label="入职日期" width="120">
        </el-table-column>

        <el-table-column fixed="right" label="操作" width="150">
          <template slot-scope="scope">
            <el-button
              @click="getUserDetail(scope.row)"
              type="text"
              size="small"
              >查看</el-button
            >
            <el-button @click="sendEmpoly(scope.row)" type="text" size="small" v-show="scope.row.userid != null"
              >办理入职</el-button
            >
            <el-button type="text" size="small" @click="deleteuser(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-main>

    <el-dialog :visible.sync="showedit" width="60%" :append-to-body="true">
      <work-user-info-edit
        :form="form"
        :eduexp="eduexp"
        :workexp="workexp"
        :family="family"
        :change="change"
        :editinfo="editinfo"
        :type="type"
      >
      </work-user-info-edit>
    </el-dialog>
  </div>
</template>

<script>
import WorkUserInfoEdit from "../WorkUser/WorkUserInfoEdit.vue";
export default {
  components: { WorkUserInfoEdit },
  props: ["tableData"],

  data() {
    return {
      showedit:false,
      type: 1,
      editinfo: true,
      form: {},
      eduexp: [],
      workexp: [],
      family: [],
      change:[],
    };
  },

  methods: {
    sendEmpoly(row) {
      this.$bus.$emit("sendEmpoly", row);
    },


    async deleteuser(row) {
      this.$confirm("是删除该条信息？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
      let id = row.id;
      try {
        let res = this.$axios.get(`api/member/deleteuser?id=` + id);
        this.$message({
                message: res.data,
                type: "success",
              });
      } catch (e) {}
    })
        .catch(function (error) {
          console.log(error);
        });
    },


    async getUserDetail(row) {
      let id = row.id;
      try {
        let res = await this.$axios.get(`api/member/getuserdetail?id=` + id);
        this.form = res.data.member[0];
        this.eduexp = res.data.eduexp;
        this.workexp = res.data.workexp;
        this.change=res.data.change;
        this.dingtalkdeplist = res.data.dingtalkdeplist;
        this.family = res.data.family;
        this.userid=res.data.member[0].id;
        this.showedit=true;
        // this.$refs.rsu2.postvalue
        // this.$refs.rsu.setuser(this.form.userid);
      } catch (e) {}
    },

    tableRowClassName({ row, rowIndex }) {
      if (row.userid === null) {
        return "warning-row";
      } else {
        return "success-row";
      }
      return "";
    },
  },
};
</script>

<style>
.el-table .warning-row {
  background: oldlace;
}

.el-table .success-row {
  background: #f0f9eb;
}
</style>